<template>
  <div class="signin">
   <h1>签到页</h1>
   <van-calendar v-model="show" :formatter="formatter" :poppable="false" @confirm="onConfirm" row-height='45' :show-confirm='false' :show-title='false' :show-mark='false' :style="{ height: '300px',width:'300px',margin:'50px auto' }" />
  </div>
</template>

<script>
import {signin} from '@/http/api'
export default {
  name: '',
  data() { 
    return {
      date: '',
      show: true,
    }
  },
  props: {

  },
  components:{
  },
  created(){

  },
  async mounted() {
    
      const tady=new Date();
      const year = tady.getFullYear();
      const month_new=tady.getMonth() + 1;
      const date_new=tady.getDate();

     let res=await signin({date:`2021-9-2`});
    console.log(res)
  },
  methods:{
      formatter(day) {
      const month = day.date.getMonth() + 1;
      const date = day.date.getDate();

      const tady=new Date();
      const year = tady.getFullYear();
      const month_new=tady.getMonth() + 1;
      const date_new=tady.getDate();

      if(month==month_new&&date_new==date){
           day.bottomInfo = '+1';
           day.text='√'
            //  console.log(year,month_new,date_new)
            //  this.date=`${year}-${month_new}-${date_new}`
      }
      

    //   if (month === 5) {
    //     if (date === 1) {
    //       day.topInfo = '劳动节';
    //     } else if (date === 4) {
    //       day.topInfo = '青年节';
    //     } else if (date === 11) {
    //       day.text = '今天';
    //     }
    //   }

    //   if (day.type === 'start') {
    //     day.bottomInfo = '入住';
    //   } else if (day.type === 'end') {
        // day.bottomInfo = '离店';
    //   }
  

      return day;
    },
    onConfirm(date) {
      this.show = false;
      this.date = this.formatDate(date);
    },

  },
 watch :{

 }, 
 }
</script>

<style>
.van-calendar__bottom-info{
    bottom:-1px !important;
}
.van-calendar__selected-day{
   border-radius:50%;
}
</style>